import defaultCover from '@/assets/default_album.jpg';
import store from '@/store/index';
import { timeFormat } from '@/utils/audio';

function formatAudio(audio) {
    Object.keys(audio).map((key) => {
        if (!audio[key]) audio[key] = '';
        return key;
    });
    // eslint-disable-next-line prefer-destructuring
    audio.url = audio.url.split('?')[0];
    audio.cover = audio.cover || defaultCover;
    return audio;
}

export default {
    namespaced: true,
    state: {
        audio: new Audio(),
        audioStatus: false,
        audioVolume: 1,
        audioIndex: 0,
        loopModel: 0, // 0:单曲, 1:列表循环, 2: 随机循环
        activeLength: 0,
        buffered: 0,
        playListState: false,
        playList: [
            {
                url: 'https://music.cytus2.dragonest.com/tune/paff001_007.mp3',
                cover:
          'https://music.cytus2.dragonest.com/cover/PAFF/thumb/Gravity.png',
                name: 'Gravity',
                artist: 'M2U',
                current: '00:00',
                duration: 0,
                durationFromat: '01:00',
            },
            {
                url: 'https://music.cytus2.dragonest.com/tune/paff001_005.mp3',
                cover:
          'https://music.cytus2.dragonest.com/cover/PAFF/thumb/Baptism%20of%20Fire%20%28CliqTrack%20remix%29.png',
                name: 'Baptism of Fire (CliqTrack remix)',
                artist: 'Louise Penman',
                current: '00:00',
                duration: 0,
                durationFromat: '01:00',
            }, {
                url: 'https://music.cytus2.dragonest.com/tune/paff001_002.mp3',
                cover:
          'https://music.cytus2.dragonest.com/cover/PAFF/thumb/Bullet%20Waiting%20for%20Me%20%28James%20Landino%20remix%29.png',
                name: 'Bullet Waiting for Me (James Landino remix)123',
                artist: 'Nikki Simmons',
                current: '00:00',
                duration: 0,
                durationFromat: '01:00',
            }, {
                url: 'https://music.cytus2.dragonest.com/tune/paff001_004.mp3',
                cover:
          'https://music.cytus2.dragonest.com/cover/PAFF/thumb/Fight%20Another%20Day%20%28Andy%20Tunstall%20remix%29.png',
                name: 'Fight Another Day (Andy Tunstall remix)',
                artist: 'Kat Penkin',
                current: '00:00',
                duration: 0,
                durationFromat: '01:00',
            }, {
                url: 'https://miva.oss-cn-beijing.aliyuncs.com/a_hisa%20-%20Town%20of%20Windmill.mp3',
                cover:
          'https://music.cytus2.dragonest.com/cover/PAFF/thumb/Fight%20Another%20Day%20%28Andy%20Tunstall%20remix%29.png',
                name: 'Fight Another Day (Andy Tunstall remix)',
                artist: 'Kat Penkin',
                current: '00:00',
                duration: 0,
                durationFromat: '01:00',
            }],
        nowPlay: {
            url: '',
            cover: defaultCover,
            name: '',
            artist: '',
            current: '00:00',
            duration: 0,
            durationFromat: '00:00',
        },
    },
    mutations: {
        ADD_AUDIO_TO_PLAYLIST: (state, audio) => {
            state.playList.unshift(formatAudio(audio));
            store.commit('audio/TOOGEL_NOW_PLAY', 0);
        },
        ADD_AUDIO_NEXT_PLAY: (state, audio) => {
            formatAudio(audio);
            state.playList.splice(state.audioIndex + 1, 0, audio);
        },
        // 打开&关闭播放列表
        TOOGEL_PLAYLIST_STATE: (state) => {
            state.playListState = !state.playListState;
            document.body.style.overflow = state.playListState ? 'hidden' : '';
        },
        // 从播放列表中删除
        DELETE_PLAYLIST_ONECE: (state, index) => {
            state.playList.splice(index, 1);
        },
        // 上一首
        PLAY_PREV: (state) => {
            const { playList, audioIndex: index } = state;
            store.commit('audio/TOOGEL_NOW_PLAY', index === 0 ? playList.length - 1 : index - 1);
        },
        // 下一首
        PLAY_NEXT: (state) => {
            const { playList, audioIndex: index } = state;
            // 随机循环模式
            if (state.loopModel === 2) {
                const random = Math.floor(Math.random() * state.playList.length);
                store.commit('audio/TOOGEL_NOW_PLAY', random);
                return;
            }
            const nextIndex = index >= playList.length - 1 ? 0 : index + 1;
            store.commit('audio/TOOGEL_NOW_PLAY', nextIndex);
        },
        // 暂停&播放
        TOOGEL_AUDIO_STATUS: (state) => {
            state.audioStatus = !state.audioStatus;
            if (state.audioStatus) {
                state.audio.play();
            } else {
                state.audio.pause();
            }
        },
        // 切换循环模式
        TOOGEL_LOOP_MODEL: (state) => {
            state.loopModel = state.loopModel >= 2 ? 0 : state.loopModel += 1;
        },
        // 设置音量
        SETTING_VOLUME: (state, data) => {
            state.audioVolume = data / 100;
            state.audio.volume = state.audioVolume;
        },
        // 设置进度
        SETTING_PROGRESS: (state, data) => {
            state.activeLength = data;
            state.audio.currentTime = state.nowPlay.duration * (data / 100);
        },
        // 切换当前播放
        TOOGEL_NOW_PLAY: (state, index) => {
            const audio = state.playList[index];
            state.nowPlay = audio;
            state.audio.src = audio.url;
            state.audio.play();
            state.audio.loop = false;
            state.audioStatus = true;
            state.audioVolume = state.audio.volume;
            state.audioIndex = index;
            state.audio.onloadedmetadata = () => {
                state.nowPlay.durationFromat = timeFormat(state.audio.duration);
                state.nowPlay.duration = state.audio.duration;
            };
            state.audio.ontimeupdate = () => {
                const currentSeconds = state.audio.currentTime;
                const playProgress = (currentSeconds / state.nowPlay.duration) * 100;
                if (!Number.isNaN(currentSeconds)) {
                    state.nowPlay.current = timeFormat(currentSeconds);
                    state.activeLength = Math.floor(playProgress);
                    const { buffered } = state.audio;
                    if (buffered.length) {
                        // 获取已缓存的时间
                        state.buffered = (buffered.end(buffered.length - 1) / state.audio.duration) * 100;
                    }
                } else {
                    state.nowPlay.current = '00:00';
                }
                if (playProgress === 100) {
                    state.musicStatus = false;
                }
            };
            state.audio.onended = () => {
                // 单曲循环模式
                if (state.loopModel === 0) {
                    store.commit('audio/TOOGEL_NOW_PLAY', index);
                    return;
                }
                // 列表循环模式
                store.commit('audio/PLAY_NEXT');
            };
        },
    },
    actions: {},
};
